<template>
  <div class="container box">
    <div class="search_form">
      <div>
        <el-date-picker

                size="mini" clearable  style="width: 220px"
                v-model="searchForm.loginTime"
                type="daterange"
                value-format="yyyy-MM-dd"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
        </el-date-picker>

        <el-input size="mini" clearable placeholder="登录账号" v-model="searchForm.accNo" class="others"></el-input>

        <el-select  size="mini" style="width: 100px" clearable v-model="searchForm.status" placeholder="登录状态" class="others">
          <el-option
                  v-for="item in options_status"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
          </el-option>
        </el-select>
        <el-button class="search_btn" type="primary" icon="el-icon-search" size="mini" @click=checkOperList>查询</el-button>
        <el-button icon="el-icon-refresh-right" size="mini" @click="resetSearch">重置</el-button>
      </div>
      <!-- <div>
        <el-tooltip class="item" content="新增" placement="top">
          <el-button size="mini" icon="iconfont icon-tianjia"></el-button>
        </el-tooltip>
      </div> -->
    </div>
    <keep-alive>
      <BaseTable :loading="loading" ref="baseTable" :data="tableData" :columns="columns" :tableHeight="tableHeight" :pagination="queryall" @details="getSelectRow" @size-change="sizeChange" @current-change="pageChange"></BaseTable>
    </keep-alive>

  </div>
</template>
<script>
import drawer from '@/components/BaseTable/drawer'
import BaseTable from '@/components/BaseTable'
export default {
  components: {
    drawer,
    BaseTable,
  },
  name: 'outServiceManageList',
  data() {
    return {
      tableHeight: window.innerHeight - 200,
      drawer: false,
      direction: 'rtl',
      queryall: {
        totalNum: 10,
        startpage: 1,
        pagesize: 15
      },
      searchForm: {
        accNo:'',
        status:'',
        loginTime:''
      },
      operForm:{},

      options_status:[
        {
          value: '成功',
          label: '成功'
        }, {
          value: '失败',
          label: '失败'
        }, {
          value: '',
          label: '所有'
        },
      ],
      workComps: [],
      tableData: [],
      loading: false,
      columns: [
        {
          prop: 'accNo',
          label: '登录账号 '
        }, {
          prop: 'userName',
          label: '登录人姓名 '
        }, {
          prop: 'dept',
          label: '部门'
        }, {
          prop: 'companyName',
          label: '登录人公司'
        }, {
          prop: 'loginIp',
          label: '登录IP'
        },
        {
          prop: 'location',
          label: '登录地点'
        },
        {
          prop: 'os',
          label: '登录系统'
        },
        {
          prop: 'browser',
          label: '登录浏览器'
        }, {
          prop: 'status',
          label: '登录状态'
        },{
          prop: 'loginTime',
          label: '登录时间'
        },
      ],
    }
  },
  created() {
    this.checkOperList()
  },

    methods: {
    //删除
    operXq(row) {
      this.drawer = true
      this.operForm= row;
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
              .then(_ => {
                done();
              })
              .catch(_ => {});
    },

    //查询操作日志
      async checkOperList() {
      if(this.searchForm.loginTime==null){
        this.searchForm.loginTime=''
      }
        this.loading = true

      const res = await this.$http.get(
              `/${this.$ServiceName}/api/external/loginlog/queryall?startpage=${this.queryall.startpage}&pagesize=${this.queryall.pagesize}&accNo=${this.searchForm.accNo}&status=${this.searchForm.status}&loginTime=${this.searchForm.loginTime}`
      )

        if (res.status == 200) {
          this.loading = false
          if (res.data.success) {
            this.tableData = res.data.data.pages
            this.queryall.startpage = res.data.data.pageNum // 当前页
            this.queryall.pagesize = res.data.data.pageSize
            this.queryall.totalNum = res.data.data.totalNum
          }
        } else {
          this.$message.error('获取数据失败！')
        }
    },
    // getNewsList() {
    //   var params = {
    //   }
    //   let para = Object.assign({}, this.queryall, params)
    //   this.$http.get(`/psys-external-service/api/external/exnewsinfo/${this.$version}/listall`, {
    //     params: para
    //   }).then(res => {
    //     this.tableData = res.data.data.pages
    //     this.queryall.pagesize = res.data.data.pageSize
    //     this.queryall.totalNum = res.data.data.totalNum
    //   })
    // },
    getSelectRow(rowData) {
      this.selectBrageData = rowData;
      //console.log(rowData)
    },
    pageChange(val) {
      this.queryall.startpage = val
      this.checkOperList()
    },
    sizeChange(val) {
      this.queryall.pagesize = val
      this.checkOperList()
    },
    resetSearch() {
      this.searchForm = {
        title: null,
      }
      this.queryall.startpage = 1
    },
  },
}
</script>
<style lang="less" scoped>
@import "./../../../assets/searchfrom";
/deep/.ql-container {
  height: 380px;
}
</style>
